<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>按键修饰符 '@keyup.esc' & '@keydown.enter'</title>
    <script src="../lib/vue-2.6.12.js"></script>
    <link href="../image/favicon.ico" rel="shortcut icon">
</head>
<body>
    <div id="app">
        <!--  只在 ‘key’ 是 ‘Esc’ 时调用 'clearInput()'-->
        <input type="text" @keyup.esc="clearInput" @keydown.enter="commitAjax">
    </div>

    <script>
        const vm = new Vue({
            el: '#app',
            data: {

            },
            methods: {
                clearInput(e){
                    console.log('触发了 clearInput 方法')
                    // e.target.value获取的就是你选择接受事件的元素输入的或者选择的值
                    // 这里清空 input 里面的内容
                    e.target.value = ''
                },
                commitAjax(){
                    console.log('触发了 commitAjax 方法')

                },

            }
        })
    </script>
</body>
</html>